import { themeConfig } from '@/config/theme-config';
import { PropertyPanel } from '@/modules/PropertyPanel/PropertyPanel';
import { StageCanvas } from '@/modules/StageCanvas/StageCanvas';
import {
  ToolBarEnd,
  ToolBarLeft,
  ToolBarMiddle,
} from '@/modules/ToolBar/ToolBar';
import { ConfigProvider } from 'antd';
import { CustomLayout } from '../modules/Layout/CustomLayout';
import { StyleProvider } from '@ant-design/cssinjs';
import { Limit } from '@/modules/Limit/Limit';

const log = console.log.bind(null, '[page]');

export default function IndexPage() {
  return (
    <StyleProvider>
      <ConfigProvider theme={themeConfig}>
        <Limit>
          <CustomLayout
            header={{
              left: <ToolBarLeft />,
              middle: <ToolBarMiddle />,
              right: <ToolBarEnd />,
            }}
            content={<StageCanvas />}
            sider={<PropertyPanel />}
          />
        </Limit>
      </ConfigProvider>
    </StyleProvider>
  );
}
